<template>
<div>
    <div class="container" v-if="flag!='r'">
        <div class="handle-box">
                <el-radio-group v-model="radio1" 
                        style="margin-bottom: 20px;"
                        fill="#1C84C6" 
                        @change="changeRadio">
                        <el-radio-button label="创建考试"  value="创建考试"/>
                        <el-radio-button label="考试管理"  value="考试管理"/>
                        </el-radio-group>
            </div>
    <examManagementListZ v-model:btn-state="btnState" @send-row-data="getEditData"  @send-record="showRecord" v-if="btnState==0"></examManagementListZ>
    <CreateExam v-else-if="btnState==1"></CreateExam>
    <CreateExam v-else  :rowData="rowData"></CreateExam>
    </div>
    <div class="container"  v-else>
        <TestRecord  :headerData="headerData" v-model:flag="flag"></TestRecord>
    </div>
</div>
</template>

<script setup>
import {ref}  from 'vue'
import examManagementListZ from './examSubVue/examManagementListZ.vue';
import CreateExam from '@/views/exam/examSubVue/CreateExam.vue'
import TestRecord from './examSubVue/TestRecord.vue';

const btnState = ref(0)//默认是考试管理页面
const radio1 = ref('考试管理')
const changeRadio =()=>{
	if(radio1.value=='创建考试'){
		btnState.value=1
	}else{
		btnState.value=0
	}
}

const rowData = ref({})
const getEditData=(data)=>{
    console.log(data,'data- ---')
    rowData.value=data
    radio1.value=''
    btnState.value=3
}
/**-------显示考试记录的组件----------- */
const flag  = ref('')
const headerData = ref()
const showRecord = (data)=>{
    flag.value=data.flag
    headerData.value=data.data
    console.log(flag.value,'查看考试记录','data.data',headerData.value)
   
}
</script >
<style lang="less" scoped>
</style>